<!-- ============================================================== -->
<!-- Main wrapper - style you can find in pages.scss -->
<!-- ============================================================== -->

<div class="grid login-register login-sidebar" style="background-image:url(assets/images/background/data-bg.png);">
	<div class="ui-lg-8 ui-xl-9" style="background: none;"></div>
	<div class="col-10 col-offset-1 ui-md-6 ui-md-offset-3 ui-lg-4 ui-lg-offset-0 ui-xl-3 login-box"
		style="background: none;">

		<div class="card-login">

			<form [formGroup]="form" (ngSubmit)="registrarUser()" class="form-horizontal form-material">
				<a href="javascript:void(0)" class="text-center db">
					<img class="img-fluid" src="assets/images/logos/logo.png" alt="Home" />
					<br />
					<img class="img-fluid" style="height: 6vh;" src="assets/images/logos/logo-texto.png" alt="Home" />
				</a>
				<h3 class="box-title mt-2">Registrate ahora</h3>
				<small> Crea una cuenta y disfruta</small>
				<div class="form-group mt-2">
					<div class="col-12">
						<input pInputText formControlName="name" class="w-100" type="text" placeholder="Nombre"
							required />
					</div>
					<div class="col-12">
						<input pInputText formControlName="email" class="w-100" type="email" placeholder="Correo"
							required />
					</div>
					<div class="col-12">
						<input pInputText formControlName="password" class="w-100" type="password"
						i18n-placeholder placeholder="Contraseña" autocomplete="new-password" required />
					</div>
					<div class="col-12">
						<input pInputText formControlName="password2" class="w-100" type="password"
						i18n-placeholder	placeholder="Confirma contraseña" required />
					</div>
				</div>
				<div class="form-group grid">
					<div class="col-12">
						<div class="checkbox checkbox-primary pt-0">
							<input id="checkbox-signup" type="checkbox" formControlName="terminos" />
							<label i18n="@@terms1" for="checkbox-signup"> Estoy de acuerdo con los <a
									(click)="conditionsDialog()">términos</a></label>
						</div>
					</div>
				</div>
				<div class="form-group text-center mt-2">
					<div class="col-12">
						<button pButton type="submit" label="Registrarme" class="ui-button-rounded w-100"></button>
					</div>
				</div>
				<div class="form-group mb-0">
					<div class="col-12 text-center">
						<p i18n="@@haveAccount">
							¿Tienes una cuenta? <a [routerLink]="['/login']" class="text-info ml-2">
								<b>Ingresa ahora</b></a>
						</p>
					</div>
				</div>
			</form>

		</div>

	</div>
</div>

<app-conditions *ngIf="conditions" [controller]="conditions"></app-conditions>